import React from 'react';
import { Form, Input, Select, Button, Row, Col } from 'antd';

const { Option } = Select;

/**
 * 权限搜索表单组件
 * @param {Object} props
 * @param {Function} props.onSearch - 搜索回调
 * @param {Function} props.onReset - 重置回调
 */
const SearchForm = ({ onSearch, onReset }) => {
  const [form] = Form.useForm();

  // 处理搜索
  const handleSearch = () => {
    const values = form.getFieldsValue();
    onSearch(values);
  };

  // 处理重置
  const handleReset = () => {
    form.resetFields();
    onReset();
  };

  return (
    <Form
      form={form}
      layout="inline"
      style={{ marginBottom: 24 }}
    >
      <Row gutter={24} style={{ width: '100%' }}>
        <Col span={6}>
          <Form.Item name="name" label="权限名称">
            <Input placeholder="请输入权限名称" allowClear />
          </Form.Item>
        </Col>
        <Col span={6}>
          <Form.Item name="module" label="所属模块">
            <Input placeholder="请输入所属模块" allowClear />
          </Form.Item>
        </Col>
        <Col span={6}>
          <Form.Item name="type" label="权限类型">
            <Select placeholder="请选择权限类型" allowClear>
              <Option value="api">API接口</Option>
              <Option value="menu">菜单</Option>
              <Option value="button">按钮</Option>
            </Select>
          </Form.Item>
        </Col>
        <Col span={6}>
          <Form.Item>
            <Button type="primary" onClick={handleSearch} style={{ marginRight: 8 }}>
              搜索
            </Button>
            <Button onClick={handleReset}>
              重置
            </Button>
          </Form.Item>
        </Col>
      </Row>
    </Form>
  );
};

export default SearchForm;